<template>
	<view>
		<template v-if="!isLogin">
			<!-- 未登录 -->
			<view class="login">登录仿糗百,体验更多功能</view>
			<!-- 第三方登录 -->
			<other-login style="margin-top: 20upx;" />
			<!-- 账号密码登录 -->
			<view class="d-flex jc-center ai-center" @tap="toLogin">
				账号密码登录
				<text class="iconfont icon-jinru"></text>
			</view>
		</template>
		<!-- 已登录 -->
		<profile-info v-if="isLogin" />
		<!-- 数据 -->
		<profile-data v-if="isLogin" style="margin-top: 20upx;" @openItem="openItem" />
		<!-- 广告位 -->
		<view class="profile-adv">
			<image src="../../static/image/demo20.jpg" mode="widthFix" lazy-load></image>
		</view>
		<!-- 功能列表 -->
		<view class="profile-list">
			<block v-for="(item,index) in list" :key="index">
				<profile-list-item :item="item" :index="index" />
			</block>
		</view>
	</view>
</template>

<script>
	import profileListItem from "components/profile/profile-list-item.vue"
	import profileInfo from "components/profile/profile-info.vue"
	import otherLogin from "components/profile/other-login.vue"
	import profileData from "components/profile/profile-data.vue"
	export default {
		data() {
			return {
				isLogin: false,
				list: [{
						icon: "liulan",
						iconColor: "#00aa00",
						name: "浏览历史",
						tapType: "",
						url: ""
					},
					{
						icon: "huiyuanvip",
						iconColor: "#ff5577",
						name: "糗百认证",
						tapType: "",
						url: ""
					},
					{
						icon: "keyboard",
						iconColor: "#0055ff",
						name: "审核糗事",
						tapType: "",
						url: ""
					}
				]
			}
		},
		methods: {
			openItem(index) {
				console.log(index)
			},
			// 去登录
			toLogin() {
				this.$Router.push({
					name: 'login'
				})
			}
		},
		components: {
			profileListItem,
			profileInfo,
			otherLogin,
			profileData
		},
		onNavigationBarButtonTap(e) {
			if (e.index === 0) {
				this.$Router.push({
					name: 'user-setup'
				})
			}
		},
		onShow() {
			this.isLogin = uni.getStorageSync('user') ? true : false
		}
	}
</script>

<style lang="scss" scoped>
	.login {
		text-align: center;
		margin-top: 20upx;
	}

	.profile-adv {
		padding: 20upx;

		image {
			width: 100%;
			height: 150upx;
			border-radius: 20upx;
		}
	}
</style>
